<template>
  <el-col :span="12" style="float: right">
    <div class="demo-basic--circle">
      <div class="block">
<!--        <el-avatar v-if="appPhoto==null" :size="50" :src="circleUrl" />-->
<!--        <el-avatar v-else :size="50" :src="appPhoto" />-->
        <el-dropdown>
    <span class="el-dropdown-link">
      {{username}}
      <el-icon class="el-icon--right">
        <arrow-down />
      </el-icon>
    </span>
          <template #dropdown>
            <el-dropdown-menu>
              <el-dropdown-item @click="xinxi">个人订单</el-dropdown-item>
              <el-dropdown-item @click="gouwu">个人购物车</el-dropdown-item>
              <el-dropdown-item @click="tuichu">退出</el-dropdown-item>
            </el-dropdown-menu>
          </template>
        </el-dropdown>
      </div>
      <div v-for="size in sizeList" :key="size" class="block">
        <el-avatar :size="size" :src="circleUrl" />
      </div>

    </div>

  </el-col>

</template>

<script setup>
  import router from "@/router/index.js";

  // let appPhoto=localStorage.getItem("photo")
  import { ArrowDown } from '@element-plus/icons-vue'
  function tuichu(){
    router.push("/")
  }
  function xinxi(){
    router.push("/geren")
  }
  function gouwu(){
    router.push("/cart")
  }
  const username=localStorage.getItem("username")
</script>

<style scoped>

</style>